<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" th:src="@{https://unpkg.com/wangeditor/dist/wangEditor.min.js}"></script>
    <script type="text/javascript" th:src="@{https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js}"></script>
</head>
<body>
<!--富文本编辑器容器-->
    <div id="editor"></div>
    <input type="submit" value="保存" id="btn"/>
<!--内容回显-->
<div id="proContent"></div>

<script type="text/javascript">
    const E = window.wangEditor;
    const editor = new E('#editor');
    editor.create();
</script>
    <!--js中使用thymeleaf：th:inline="javascript"-->
<script th:inline="javascript">
    //获取服务器路径
    var basePath = [[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + ":" + #httpServletRequest.getServerPort() + #httpServletRequest.getContextPath()}]];
    //
    $(function () {
        //发送异步请求
        $("#btn").click(function () {
            var content=editor.txt.html();
            $.ajax({
                url:basePath+"/editor/save",
                type:"post",
                data:{"content":content},
                success:function (data) {
                   $("#proContent").html(content);
                }
            });
        });
    })
</script>
</body>
</html>